{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 0,
        "height": 12,
        "hidden": false,
        "row": 0,
        "width": 12
       },
       "report_default": {}
      }
     }
    }
   },
   "source": [
    "# Example using bqplot\n",
    "[bqplot](https://github.com/bloomberg/bqplot) is an interactive framework for the Jupyter Notebook. Together with vaex it enables interactive plots, meaning you can zoom in and out, and do selections from the plot. The plot will also update for instance when you change the selection programmatically (Using [Dataset.select](vaex.html#vaex.dataset.Dataset.select) ), or when done from the gui.\n",
    "\n",
    "## Installing bqplot\n",
    "See [bqplot installation instructions](https://github.com/bloomberg/bqplot#installation), or for pip:\n",
    "```\n",
    "$ pip install bqplot\n",
    "$ jupyter nbextension enable --py bqplot\n",
    "```\n",
    "And anaconda/conda\n",
    "```\n",
    "$ conda install -c conda-forge bqplot\n",
    "```"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true
   },
   "outputs": [],
   "source": [
    "import bqplot.pyplot as plt"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "(0, 9, 0, 'b10')"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "import bqplot\n",
    "bqplot._version.version_info"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'/Users/maartenbreddels/anaconda3/lib/python3.5/site-packages/bqplot/__init__.py'"
      ]
     },
     "execution_count": 3,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "bqplot.__file__"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true
   },
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "2e3d4f666b784ec09f429da08ab92e83"
      }
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "x = np.linspace(0, 1, 10)\n",
    "y = x**2\n",
    "plt.scatter(x, y)\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 0,
        "height": 4,
        "hidden": true,
        "row": 12,
        "width": 4
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "The autoreload extension is already loaded. To reload it, use:\n",
      "  %reload_ext autoreload\n"
     ]
    }
   ],
   "source": [
    "# only used in develop mode (remove this)\n",
    "%load_ext autoreload\n",
    "%autoreload 2"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "import vaex as vx\n",
    "import ipywidgets as widgets\n",
    "import numpy as np"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 4,
        "height": 4,
        "hidden": true,
        "row": 12,
        "width": 4
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "12,484,333 rows\n"
     ]
    }
   ],
   "source": [
    "# use the taxi dataset\n",
    "ds = vx.datasets.nyctaxi_yellow_2015_jan.fetch()\n",
    "# or do whole 2015\n",
    "# ds = vx.datasets.nyctaxi_2015.get()\n",
    "# we'll show pickup and dropoff locations\n",
    "pickups = ds(\"pickup_longitude\", \"pickup_latitude\")\n",
    "dropoffs = ds(\"dropoff_longitude\", \"dropoff_latitude\")\n",
    "# default region we'll look at\n",
    "geo_limits = lonrange, latrange = (-74.0655186833, -73.8048761181), (40.6444424556, 40.9050850209)\n",
    "print(\"{:,} rows\".format(len(ds)))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "ename": "NameError",
     "evalue": "name 'w1' is not defined",
     "output_type": "error",
     "traceback": [
      "\u001b[0;31m---------------------------------------------------------------------------\u001b[0m",
      "\u001b[0;31mNameError\u001b[0m                                 Traceback (most recent call last)",
      "\u001b[0;32m<ipython-input-5-b45fb8be76ba>\u001b[0m in \u001b[0;36m<module>\u001b[0;34m()\u001b[0m\n\u001b[0;32m----> 1\u001b[0;31m \u001b[0;34m(\u001b[0m\u001b[0mw1\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0m__class__\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0m__base__\u001b[0m\u001b[0;34m)\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n\u001b[0m",
      "\u001b[0;31mNameError\u001b[0m: name 'w1' is not defined"
     ]
    }
   ],
   "source": [
    "(w1.__class__.__base__)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 0,
        "height": 19,
        "hidden": false,
        "row": 12,
        "width": 9
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "ename": "NameError",
     "evalue": "name '_parse_f' is not defined",
     "output_type": "error",
     "traceback": [
      "\u001b[0;31m---------------------------------------------------------------------------\u001b[0m",
      "\u001b[0;31mNameError\u001b[0m                                 Traceback (most recent call last)",
      "\u001b[0;32m<ipython-input-6-e976c098b318>\u001b[0m in \u001b[0;36m<module>\u001b[0;34m()\u001b[0m\n\u001b[0;32m----> 1\u001b[0;31m \u001b[0mpickups\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0mplot_bq\u001b[0m\u001b[0;34m(\u001b[0m\u001b[0msize\u001b[0m\u001b[0;34m=\u001b[0m\u001b[0;36m512\u001b[0m\u001b[0;34m,\u001b[0m \u001b[0mlimits\u001b[0m\u001b[0;34m=\u001b[0m\u001b[0mgeo_limits\u001b[0m\u001b[0;34m,\u001b[0m \u001b[0mf\u001b[0m\u001b[0;34m=\u001b[0m\u001b[0mnp\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0mlog1p\u001b[0m\u001b[0;34m)\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n\u001b[0m",
      "\u001b[0;32m/Users/maartenbreddels/vaex/src/vaex/vaex/legacy.py\u001b[0m in \u001b[0;36mplot_bq\u001b[0;34m(self, grid, size, limits, square, center, weight, figsize, aspect, f, fig, axes, xlabel, ylabel, title, group_by, group_limits, group_colors, group_labels, group_count, cmap, scales, tool_select, bq_cleanup, **kwargs)\u001b[0m\n\u001b[1;32m    792\u001b[0m                 \u001b[0;32mimport\u001b[0m \u001b[0mipywidgets\u001b[0m \u001b[0;32mas\u001b[0m \u001b[0mwidgets\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n\u001b[1;32m    793\u001b[0m                 \u001b[0;32mimport\u001b[0m \u001b[0mbqplot\u001b[0m \u001b[0;32mas\u001b[0m \u001b[0mbq\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n\u001b[0;32m--> 794\u001b[0;31m                 \u001b[0mf\u001b[0m \u001b[0;34m=\u001b[0m \u001b[0m_parse_f\u001b[0m\u001b[0;34m(\u001b[0m\u001b[0mf\u001b[0m\u001b[0;34m)\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n\u001b[0m\u001b[1;32m    795\u001b[0m                 \u001b[0mlimits\u001b[0m \u001b[0;34m=\u001b[0m \u001b[0mself\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0mlimits\u001b[0m\u001b[0;34m(\u001b[0m\u001b[0mlimits\u001b[0m\u001b[0;34m)\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n\u001b[1;32m    796\u001b[0m                 \u001b[0;32mimport\u001b[0m \u001b[0mvaex\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0mext\u001b[0m\u001b[0;34m.\u001b[0m\u001b[0mbqplot\u001b[0m\u001b[0;34m\u001b[0m\u001b[0m\n",
      "\u001b[0;31mNameError\u001b[0m: name '_parse_f' is not defined"
     ]
    }
   ],
   "source": [
    "pickups.plot_bq(size=512, limits=geo_limits, f=np.log1p)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 0,
        "height": 4,
        "hidden": false,
        "row": 31,
        "width": 12
       },
       "report_default": {}
      }
     }
    }
   },
   "source": [
    "# Example 2\n",
    "We will now plot both the pickup and dropoff locations, link their scales (see bqplot documentation), and enable selections (using tool_select=True). When a selection is made, the plot will be updated."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 0,
        "height": 14,
        "hidden": false,
        "row": 35,
        "width": 12
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "data": {
      "application/javascript": [
       "define(\"vaex.ext.bqplot\", [\"jupyter-js-widgets\", \"bqplot\", \"underscore\"],\n",
       "       function(widgets, bqplot, _) {\n",
       "    \"use strict\";\n",
       "\n",
       "    var Image = bqplot.Mark.extend({\n",
       "\n",
       "        render: function() {\n",
       "            var base_render_promise = Image.__super__.render.apply(this);\n",
       "            this.im = this.el.append(\"image\")\n",
       "                .attr(\"class\", \"dot_img\")\n",
       "                .attr(\"xlink:href\", this.model.get('src'))\n",
       "                .attr(\"x\", 0) //this.model.get('x'))\n",
       "                .attr(\"y\", 0) //this.model.get('y'))\n",
       "                .attr(\"width\", 1)//this.model.get('width'))\n",
       "                .attr(\"height\", 1)// this.model.get('height'))\n",
       "                .attr(\"preserveAspectRatio\", this.model.get('preserve_aspect_ratio'));\n",
       "\n",
       "            this.width = this.parent.plotarea_width;\n",
       "            this.height = this.parent.plotarea_height;\n",
       "            this.map_id = widgets.uuid();\n",
       "            this.display_el_classes = [\"event_layer\"];\n",
       "            var that = this;\n",
       "            return base_render_promise.then(function() {\n",
       "                that.event_listeners = {};\n",
       "                that.create_listeners();\n",
       "                that.draw();\n",
       "            });\n",
       "        },\n",
       "\n",
       "        set_positional_scales: function() {\n",
       "            var x_scale = this.scales.x,\n",
       "                y_scale = this.scales.y;\n",
       "            this.listenTo(x_scale, \"domain_changed\", function() {\n",
       "                if (!this.model.dirty) {\n",
       "                    var animate = true;\n",
       "                    //this.update_xy_position(animate); }\n",
       "                    this.set_ranges()\n",
       "                 }\n",
       "            });\n",
       "            this.listenTo(y_scale, \"domain_changed\", function() {\n",
       "                if (!this.model.dirty) {\n",
       "                    var animate = true;\n",
       "                    //this.update_xy_position(animate);\n",
       "                    this.set_ranges()\n",
       "                }\n",
       "            });\n",
       "        },\n",
       "        set_ranges: function() {\n",
       "\t            var x_scale = this.scales.x,\n",
       "\t                y_scale = this.scales.y\n",
       "\t                ;\n",
       "\t            if(x_scale) {\n",
       "\t                x_scale.set_range(this.parent.padded_range(\"x\", x_scale.model));\n",
       "\t            }\n",
       "\t            if(y_scale) {\n",
       "\t                y_scale.set_range(this.parent.padded_range(\"y\", y_scale.model));\n",
       "\t            }\n",
       "\t            var x_scale = this.scales.x, y_scale = this.scales.y;\n",
       "\t            var that = this;\n",
       "\t            var animation_duration = this.parent.model.get(\"animation_duration\");// : 0;\n",
       "\t            this.el.selectAll(\".dot_img\").transition()\n",
       "\t                .duration(animation_duration)\n",
       "\t                .attr(\"transform\", function(d) {\n",
       "                        var sx = x_scale.scale(1) - x_scale.scale(0);\n",
       "                        var sy = y_scale.scale(1) - y_scale.scale(0);\n",
       "                        var tx = x_scale.scale(that.model.get('x')) + x_scale.offset\n",
       "                        var ty = y_scale.scale(that.model.get('y')) + y_scale.offset\n",
       "                        sx *= that.model.get('width')\n",
       "                        sy *= that.model.get('height')\n",
       "                        console.log(that.model)\n",
       "                        console.log(that.model.get('width'))\n",
       "                        console.log(sx)\n",
       "                        console.log(sy)\n",
       "\t                    return \"translate(\" + tx +\n",
       "\t                                    \",\" + ty + \") scale(\" + sx + \", \" + sy + \")\"});\n",
       "\t            //this.x_pixels = this.model.mark_data.map(function(el) { return x_scale.scale(el.x) + x_scale.offset; });\n",
       "\t            //this.y_pixels = this.model.mark_data.map(function(el) { return y_scale.scale(el.y) + y_scale.offset; });\n",
       "        },\n",
       "\n",
       "        create_listeners: function() {\n",
       "            Image.__super__.create_listeners.apply(this);\n",
       "\n",
       "            this.listenTo(this.model, \"change:src\", this.update_src, this);\n",
       "            this.listenTo(this.model, \"change:x\", this.update_x, this);\n",
       "            this.listenTo(this.model, \"change:y\", this.update_y, this);\n",
       "            this.listenTo(this.model, \"change:width\", this.update_width, this);\n",
       "            this.listenTo(this.model, \"change:height\", this.update_height, this);\n",
       "            this.listenTo(this.model, \"change:preserve_aspect_ratio\", this.update_preserve_aspect_ratio, this);\n",
       "        },\n",
       "\n",
       "        update_xy_position: function(animate) {\n",
       "            console.log(\"update_xy_position\");\n",
       "\n",
       "        },\n",
       "\n",
       "        update_src: function(model, new_x) {\n",
       "          //this.im.attr('x', new_x);\n",
       "          console.log(\"update src\")\n",
       "            this.im.attr(\"xlink:href\", this.model.get('src'))\n",
       "            //this.set_ranges();\n",
       "        },\n",
       "        update_x: function(model, new_x) {\n",
       "          //this.im.attr('x', new_x);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_y: function(model, new_y) {\n",
       "          //this.im.attr('y', new_y);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_width: function(model, new_width) {\n",
       "          //this.im.attr('width', new_width);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_height: function(model, new_height) {\n",
       "          //this.im.attr('height', new_height);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_preserve_aspect_ratio: function(model, new_preserve_aspect_ratio) {\n",
       "          this.im.attr('preserveAspectRatio', new_preserve_aspect_ratio);\n",
       "        },\n",
       "\n",
       "        draw: function() {\n",
       "            console.log(\"set_positional_scales\");\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "    });\n",
       "\n",
       "\n",
       "   var ImageModel = bqplot.MarkModel.extend({\n",
       "\n",
       "        defaults: _.extend({}, bqplot.MarkModel.prototype.defaults, {\n",
       "            _model_name: \"ImageModel\",\n",
       "            _view_name: \"Image\",\n",
       "            _view_module: \"vaex.ext.bqplot\",\n",
       "            _model_module: \"vaex.ext.bqplot\",\n",
       "\n",
       "            x: 0,\n",
       "            y: 0,\n",
       "            width: 1,\n",
       "            height: 1,\n",
       "        }),\n",
       "\n",
       "        initialize: function() {\n",
       "            ImageModel.__super__.initialize.apply(this);\n",
       "        },\n",
       "\n",
       "    });\n",
       "\n",
       "\n",
       "\n",
       "    console.log(\"blaat\")\n",
       "\t    return {\n",
       "\t        ImageModel: ImageModel,\n",
       "\t        Image:Image,\n",
       "\t    };\n",
       "})\n",
       "//require([\"vaex.ext.bqplot\"])"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "0.6.1\n"
     ]
    },
    {
     "data": {
      "application/javascript": [
       "define(\"vaex.ext.bqplot\", [\"jupyter-js-widgets\", \"bqplot\", \"underscore\"],\n",
       "       function(widgets, bqplot, _) {\n",
       "    \"use strict\";\n",
       "\n",
       "    var Image = bqplot.Mark.extend({\n",
       "\n",
       "        render: function() {\n",
       "            var base_render_promise = Image.__super__.render.apply(this);\n",
       "            this.im = this.el.append(\"image\")\n",
       "                .attr(\"class\", \"dot_img\")\n",
       "                .attr(\"xlink:href\", this.model.get('src'))\n",
       "                .attr(\"x\", 0) //this.model.get('x'))\n",
       "                .attr(\"y\", 0) //this.model.get('y'))\n",
       "                .attr(\"width\", 1)//this.model.get('width'))\n",
       "                .attr(\"height\", 1)// this.model.get('height'))\n",
       "                .attr(\"preserveAspectRatio\", this.model.get('preserve_aspect_ratio'));\n",
       "\n",
       "            this.width = this.parent.plotarea_width;\n",
       "            this.height = this.parent.plotarea_height;\n",
       "            this.map_id = widgets.uuid();\n",
       "            this.display_el_classes = [\"event_layer\"];\n",
       "            var that = this;\n",
       "            return base_render_promise.then(function() {\n",
       "                that.event_listeners = {};\n",
       "                that.create_listeners();\n",
       "                that.draw();\n",
       "            });\n",
       "        },\n",
       "\n",
       "        set_positional_scales: function() {\n",
       "            var x_scale = this.scales.x,\n",
       "                y_scale = this.scales.y;\n",
       "            this.listenTo(x_scale, \"domain_changed\", function() {\n",
       "                if (!this.model.dirty) {\n",
       "                    var animate = true;\n",
       "                    //this.update_xy_position(animate); }\n",
       "                    this.set_ranges()\n",
       "                 }\n",
       "            });\n",
       "            this.listenTo(y_scale, \"domain_changed\", function() {\n",
       "                if (!this.model.dirty) {\n",
       "                    var animate = true;\n",
       "                    //this.update_xy_position(animate);\n",
       "                    this.set_ranges()\n",
       "                }\n",
       "            });\n",
       "        },\n",
       "        set_ranges: function() {\n",
       "\t            var x_scale = this.scales.x,\n",
       "\t                y_scale = this.scales.y\n",
       "\t                ;\n",
       "\t            if(x_scale) {\n",
       "\t                x_scale.set_range(this.parent.padded_range(\"x\", x_scale.model));\n",
       "\t            }\n",
       "\t            if(y_scale) {\n",
       "\t                y_scale.set_range(this.parent.padded_range(\"y\", y_scale.model));\n",
       "\t            }\n",
       "\t            var x_scale = this.scales.x, y_scale = this.scales.y;\n",
       "\t            var that = this;\n",
       "\t            var animation_duration = this.parent.model.get(\"animation_duration\");// : 0;\n",
       "\t            this.el.selectAll(\".dot_img\").transition()\n",
       "\t                .duration(animation_duration)\n",
       "\t                .attr(\"transform\", function(d) {\n",
       "                        var sx = x_scale.scale(1) - x_scale.scale(0);\n",
       "                        var sy = y_scale.scale(1) - y_scale.scale(0);\n",
       "                        var tx = x_scale.scale(that.model.get('x')) + x_scale.offset\n",
       "                        var ty = y_scale.scale(that.model.get('y')) + y_scale.offset\n",
       "                        sx *= that.model.get('width')\n",
       "                        sy *= that.model.get('height')\n",
       "                        console.log(that.model)\n",
       "                        console.log(that.model.get('width'))\n",
       "                        console.log(sx)\n",
       "                        console.log(sy)\n",
       "\t                    return \"translate(\" + tx +\n",
       "\t                                    \",\" + ty + \") scale(\" + sx + \", \" + sy + \")\"});\n",
       "\t            //this.x_pixels = this.model.mark_data.map(function(el) { return x_scale.scale(el.x) + x_scale.offset; });\n",
       "\t            //this.y_pixels = this.model.mark_data.map(function(el) { return y_scale.scale(el.y) + y_scale.offset; });\n",
       "        },\n",
       "\n",
       "        create_listeners: function() {\n",
       "            Image.__super__.create_listeners.apply(this);\n",
       "\n",
       "            this.listenTo(this.model, \"change:src\", this.update_src, this);\n",
       "            this.listenTo(this.model, \"change:x\", this.update_x, this);\n",
       "            this.listenTo(this.model, \"change:y\", this.update_y, this);\n",
       "            this.listenTo(this.model, \"change:width\", this.update_width, this);\n",
       "            this.listenTo(this.model, \"change:height\", this.update_height, this);\n",
       "            this.listenTo(this.model, \"change:preserve_aspect_ratio\", this.update_preserve_aspect_ratio, this);\n",
       "        },\n",
       "\n",
       "        update_xy_position: function(animate) {\n",
       "            console.log(\"update_xy_position\");\n",
       "\n",
       "        },\n",
       "\n",
       "        update_src: function(model, new_x) {\n",
       "          //this.im.attr('x', new_x);\n",
       "          console.log(\"update src\")\n",
       "            this.im.attr(\"xlink:href\", this.model.get('src'))\n",
       "            //this.set_ranges();\n",
       "        },\n",
       "        update_x: function(model, new_x) {\n",
       "          //this.im.attr('x', new_x);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_y: function(model, new_y) {\n",
       "          //this.im.attr('y', new_y);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_width: function(model, new_width) {\n",
       "          //this.im.attr('width', new_width);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_height: function(model, new_height) {\n",
       "          //this.im.attr('height', new_height);\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "        update_preserve_aspect_ratio: function(model, new_preserve_aspect_ratio) {\n",
       "          this.im.attr('preserveAspectRatio', new_preserve_aspect_ratio);\n",
       "        },\n",
       "\n",
       "        draw: function() {\n",
       "            console.log(\"set_positional_scales\");\n",
       "            this.set_ranges();\n",
       "        },\n",
       "\n",
       "    });\n",
       "\n",
       "\n",
       "   var ImageModel = bqplot.MarkModel.extend({\n",
       "\n",
       "        defaults: _.extend({}, bqplot.MarkModel.prototype.defaults, {\n",
       "            _model_name: \"ImageModel\",\n",
       "            _view_name: \"Image\",\n",
       "            _view_module: \"vaex.ext.bqplot\",\n",
       "            _model_module: \"vaex.ext.bqplot\",\n",
       "\n",
       "            x: 0,\n",
       "            y: 0,\n",
       "            width: 1,\n",
       "            height: 1,\n",
       "        }),\n",
       "\n",
       "        initialize: function() {\n",
       "            ImageModel.__super__.initialize.apply(this);\n",
       "        },\n",
       "\n",
       "    });\n",
       "\n",
       "\n",
       "\n",
       "    console.log(\"blaat\")\n",
       "\t    return {\n",
       "\t        ImageModel: ImageModel,\n",
       "\t        Image:Image,\n",
       "\t    };\n",
       "})\n",
       "//require([\"vaex.ext.bqplot\"])"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "0.6.1\n"
     ]
    }
   ],
   "source": [
    "size = 512\n",
    "# plot bq returns a ipywigets VBox object, the first child object is the figure, and we use that to connect\n",
    "# the scales of the two figures\n",
    "w1 = pickups.plot_bq(size=size, limits=geo_limits, tool_select=True, title=\"Pickups\", f=np.log1p)\n",
    "fig = w1.children[0]\n",
    "scales = fig.marks[-1].scales\n",
    "w2 = dropoffs.plot_bq(size=size, limits=geo_limits, tool_select=True, scales=scales, title=\"Dropoffs\", f=np.log1p)\n",
    "widgets.HBox([w1, w2])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 56,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "# selecting work dropoff hours\n",
    "ds.select(\"(pickup_hour >= 7) & (pickup_hour <= 9)\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 75,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "# here is where the nightlive is\n",
    "ds.select(\"(pickup_hour >= 23) | (pickup_hour <= 4)\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 58,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "b = widgets.Button(description=\"Blaat\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 59,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 6,
        "height": 12,
        "hidden": false,
        "row": 49,
        "width": 6
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "<ipywidgets.widgets.widget_button.Button object at 0x3c1edd850>\n",
      "<ipywidgets.widgets.widget_button.Button object at 0x3c1edd850>\n"
     ]
    }
   ],
   "source": [
    "b"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 60,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 8,
        "height": 4,
        "hidden": true,
        "row": 35,
        "width": 4
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "<ipywidgets.widgets.widget_button.Button object at 0x3c1edd850>\n"
     ]
    }
   ],
   "source": [
    "b"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 61,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "def f(arg):\n",
    "    print arg\n",
    "b.on_click(f)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 62,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "b.description = \"Hoeba\""
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 65,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "col": 0,
        "height": 4,
        "hidden": true,
        "row": 39,
        "width": 4
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "1.0 1 aap\n"
     ]
    }
   ],
   "source": [
    "@widgets.interact(bla=[\"aap\", \"noot\"])\n",
    "def f(i=1., j=1, bla=\"aap\"):\n",
    "    print i, j, bla"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 66,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "t = widgets.Text()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 67,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "t"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 68,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "t.value = \"Hallo\""
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 69,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "t2 = widgets.Text()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 70,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "t2"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 73,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": [
    "widgets.ColorPicker()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true,
    "extensions": {
     "jupyter_dashboards": {
      "version": 1,
      "views": {
       "grid_default": {
        "hidden": true
       },
       "report_default": {}
      }
     }
    }
   },
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "anaconda-cloud": {},
  "extensions": {
   "jupyter_dashboards": {
    "activeView": "grid_default",
    "version": 1,
    "views": {
     "grid_default": {
      "cellMargin": 10,
      "defaultCellHeight": 20,
      "maxColumns": 12,
      "name": "grid",
      "type": "grid"
     },
     "report_default": {
      "name": "report",
      "type": "report"
     }
    }
   }
  },
  "kernelspec": {
   "display_name": "Python [default]",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.5.2"
  },
  "widgets": {
   "state": {
    "02a518fdbb044529aaeeb05e8ad650c0": {
     "views": []
    },
    "089e900ac432417591de8714aeddf3c4": {
     "views": []
    },
    "0b1b38968fb6427691d7796f9d695dca": {
     "views": []
    },
    "0fa7ec3a6ab9448693b85c1e8e1100fa": {
     "views": []
    },
    "1301e3d3598145fcbcda4713b41c8020": {
     "views": []
    },
    "181f8c873caa4269b9302e97f8193397": {
     "views": []
    },
    "1a46b7abf7354186a8746874ef36c59e": {
     "views": []
    },
    "1a6bd964903f4e3486c6d94923940fef": {
     "views": []
    },
    "1a9bff1574ef45a7831aa0dd3496ebd6": {
     "views": []
    },
    "1e07cef916274bf1a556095ae13b55dc": {
     "views": []
    },
    "1ff50b6685c648e2997189f8c9329322": {
     "views": []
    },
    "22df1f0d73a84ea8a660de233c84a5fb": {
     "views": []
    },
    "22fbeb9c46d6456c8a629939f5355096": {
     "views": []
    },
    "264c218f5789432d9a0fdd80c34b66f3": {
     "views": []
    },
    "27261681350a40b785b81eb16ea2da2c": {
     "views": []
    },
    "297e12960d274d51a345c668fcfb6846": {
     "views": []
    },
    "2b34fe17c8f2419c813c1bb816ac7f48": {
     "views": []
    },
    "2f41514e610247dbaab2a2db80128ee3": {
     "views": []
    },
    "300dda602cc74d1e9d13fe654db99908": {
     "views": []
    },
    "32f6f71502be49eaaa044742be266090": {
     "views": []
    },
    "36901073bd2c4059841067a4886410f0": {
     "views": []
    },
    "36d79a4d59bc43b1b91221091204bc4d": {
     "views": []
    },
    "3cba144acd4941e6a82fff2813800cae": {
     "views": []
    },
    "446f23f2c31142c2bfea36a0158abb32": {
     "views": []
    },
    "460e6de560234ad58eb073884c1f6128": {
     "views": []
    },
    "48466703400b47b094cc2eb0ff56d187": {
     "views": []
    },
    "48b1163ba67044c2ad027b5160492117": {
     "views": []
    },
    "4a19d95d30a54555b7a09becefdadc50": {
     "views": []
    },
    "4cfdec5559044a908c41ebfa7967ce5b": {
     "views": []
    },
    "4d92ebf2d0b8484a8790e5d0dec34331": {
     "views": []
    },
    "51da7ea9e9b84c8cb4c73167c5bee4a4": {
     "views": []
    },
    "53b5e30c636648a1a54844b0076c302b": {
     "views": []
    },
    "59360909dc7f48c8a8ff6a74a1b74b96": {
     "views": []
    },
    "5c0bb2fd6ea94fdf93f99f71ebf63531": {
     "views": []
    },
    "5d070f94b3124c3daed6d00bea4b9e8a": {
     "views": []
    },
    "5d600a6e8eed4d82ad3d1bc0a865c04c": {
     "views": []
    },
    "5f8f9a5e220047009dda104e8cd1c629": {
     "views": []
    },
    "60d0c89b4084465a8c5b2508aeaf2852": {
     "views": []
    },
    "611a3a120b7c4c078ab42b867cd9edd4": {
     "views": []
    },
    "62cfd311ce0447daa034143940a4cfd3": {
     "views": []
    },
    "68b9a19078f841ebb801c487106a07a0": {
     "views": []
    },
    "71f9206c9d3c4aafbf66ab17c825cee9": {
     "views": [
      {
       "cell_index": 5
      }
     ]
    },
    "75615c8861524685a9e2f7271820326b": {
     "views": []
    },
    "7679564f165749d0b19a99580e9d1d2f": {
     "views": []
    },
    "793ce5c72c544dba989aebc5a6d43c40": {
     "views": []
    },
    "7a63f06342554ccbaa4d7bfcd00721ef": {
     "views": []
    },
    "7cfb7e876efd4fd394d1bf846a175bb4": {
     "views": []
    },
    "7dac7889d217401b9b61f59a1f3ade36": {
     "views": []
    },
    "82bf36034c1b41c9831aa1d661508776": {
     "views": []
    },
    "8559a8c8b6434b0dab528ddf2a1d91a2": {
     "views": []
    },
    "8969e4f831be4a34abd50d392fb571d9": {
     "views": []
    },
    "8a4da72e545d48619e017db8b1e11167": {
     "views": []
    },
    "937a207274fc475da858e19ff2087c20": {
     "views": []
    },
    "955bc4d6315f4f3382c02648dd42ff4f": {
     "views": []
    },
    "97707e3e223c4d0f86a2f15c92dc41f3": {
     "views": []
    },
    "992bf498dae5400396829edd345130cf": {
     "views": []
    },
    "9b5aebdcb5d0473fa64459c037881b9b": {
     "views": []
    },
    "9d84da740d88452ea94349faea742c48": {
     "views": []
    },
    "a23e1a88aa424dc98b343dab5be3fa01": {
     "views": []
    },
    "a5b68d6455034235a34911980f64a86a": {
     "views": []
    },
    "a86c049302294125973410718d82cf98": {
     "views": []
    },
    "ab09b56beae44d388d7f336de48eb73c": {
     "views": []
    },
    "b76a7d4802eb46729466ce95a5b0cca8": {
     "views": []
    },
    "b8f512d83c524edc9141f0c6d5ac8b26": {
     "views": []
    },
    "ba00d6d40df344889a3727feaddbf4c3": {
     "views": []
    },
    "ba86076de4264f36a5af98a47e160705": {
     "views": []
    },
    "bb188de3a97846f9a84c473a2d23a87d": {
     "views": []
    },
    "c481b2ef1712459aaf99e5647695117c": {
     "views": []
    },
    "c50f11500a034e55b1ce23e0c1c0d277": {
     "views": []
    },
    "c6040a3e2efc4038807dd7f41e68f8e0": {
     "views": []
    },
    "ce031e8b9631454ca7baf7e221bf8af6": {
     "views": []
    },
    "d4382e254833467c890efa49520af219": {
     "views": []
    },
    "d4c21f3e569b4ce1aba226d45fc1bd9d": {
     "views": []
    },
    "d528f3c514544bb5b2c7592fa16c5c78": {
     "views": []
    },
    "d7e2680b9fbd4830a016b0cdefe65af5": {
     "views": []
    },
    "d9bb1a00a8064ce6996f7a8f754a3618": {
     "views": []
    },
    "db3f6dc6e1a34514bd6ffbd0acc3d678": {
     "views": []
    },
    "dbe26def85e24f0f807bc95788ba692d": {
     "views": []
    },
    "df2a76de8d604c51860860acd66c6c34": {
     "views": [
      {
       "cell_index": 7
      }
     ]
    },
    "df38018d8bfd4a5ba209116df760ed55": {
     "views": []
    },
    "e17d82c9618048bfae09a0d912355d9e": {
     "views": []
    },
    "eb6c7a47b8fe48e28d64cf93c1e03102": {
     "views": []
    },
    "ef78a2b889584d15819d51bde6241a7c": {
     "views": []
    },
    "f1ec54aba59745498b79f59175cf7eda": {
     "views": []
    },
    "f208ff639aa04a1bb108d253b3f2f26f": {
     "views": []
    },
    "f3e5be8896e043f6b67bb5e35b011807": {
     "views": []
    },
    "f4e710e0216f40e5ae444c4d640e0a9a": {
     "views": []
    },
    "f6bb1ded5c124cb38ffc93cc997eda10": {
     "views": []
    },
    "f7d4226000fe416c8326f4ab900ee10a": {
     "views": []
    },
    "f95ebe0ca4a64b009150ed0546a961e2": {
     "views": []
    }
   },
   "version": "1.1.2"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 0
}
